<template>
	<view class="index">
		<navbar></navbar>
		<!-- 标题 -->
		<h1 class="container col-f m-top80">
			{{info.name}}
		</h1>
		<!-- 简介 -->
		<view class="container col-c">
			<mp-html :content="info.detail"></mp-html>
		</view>
		<view v-if="!goods.loading || 0 < goods.list.length" class="container">
		    <!-- 藏品列表 -->
			<view class="assets-list">
				<view v-for="item in goods.list" :key="item.id" class="assets"
					@tap.stop.prevent="onAssetsTaped(item.id)">
					
					<view class="assets__img-wrapper">
						<easy-loadimage class="assets__img" mode="aspectFill" :scroll-top="scrollTop" :image-src="item.logo"></easy-loadimage>
					</view>
					<view class="assets-info">
						<view class="f-36 onelist-hidden--s">{{ item.name }}</view>
						<view class="f-22 onelist-hidden--s">{{ item.subtitle }}</view>
					</view>
				</view>
			</view>
			<view v-show="goods.list.length>3 && !goods.hasMore" class="no-more f-24">
				-更多内容敬请期待-
				<view class="bsn">
					<image src="https://p6-tt.byteimg.com/origin/pgc-image/9ed074ff2e144aaca61866b159dee4bd" mode="widthFix"></image>
				</view>
			</view>
		</view>
		<view v-if="!goods.loading && goods.list.length == 0">
			<view class="yoshop-notcont">
				<!-- <text class="dy-iconfont icon-empty"></text> -->
				<text class="iconfont icon-wushuju"></text>
				<text class="cont">暂无数据</text>
			</view>
		</view>
	</view>
</template>

<script>
	const app = getApp();
	import navbar from "@/components/navbar/navbar";
	import siteinfo from '@/siteinfo.js';
	export default {
		components: {
			navbar
		},
		data() {
			return {
				// 页面参数
				options: {},
				// 页面元素
				loading: true,
				scrollTop: 0,
				info: {},
				goods: {
					list: [],
					page: 1,
					loading: true,
					hasMore: false,
				}
			};
		},
		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad: function(options) {
			// 当前页面参数
			this.setData({
				options
			});
			this.requestData();
			
			// uni.pageScrollTo({
			// 	scrollTop: 0,
			// 	duration: 0
			// });
			// if (this.canIUseSaleCalendar) {
			// 	setTimeout(() => {
			// 		//获取tab菜单的top
			// 		this.getTabBoxTop();
			// 	}, 1000)	
			// }
		},
		onReady: function() {
			uni.setNavigationBarTitle({
				title: siteinfo.name
			});
		},
		onShow: function() {
			
		},
		/**
		 * 分享当前页面
		 */
		onShareAppMessage() {
			// let _this = this;
			return {
				// title: _this.data.page.params.share_title,
				path: '/pages/art/index?' + app.getShareUrlParams()
			};
		},
		/**
		 * 下拉刷新
		 */
		onPullDownRefresh: function() {
			// this.goods.page = 1;

			// 发售日历清空last_time,last_time 为空表示第一页
			// if (this.tab.current == 1) {
			// 	this.goods.last_time = '';
			// }

			// this.getPageData();
			this.requestData()
		},
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},
		// onReachBottom() {
		// 	if (!this.goods.loading && this.goods.hasMore) {
		// 		this.requestData();
		// 	}
		// },
		methods: {
			// 查看藏品详情
			onAssetsTaped: function(id) {
				app.navigationTo(`pages/art/detail/index?id=${id}`)
			},
			
			// 切换tab
			// onToggleTab(id) {
			// 	if (this.tab.current != id) {
			// 		this.tab.current = id;
			// 		this.goods = {
			// 				list: [],
			// 				page: 1,
			// 				loading: true,
			// 				hasMore: true,
			// 				last_time: ''
			// 			},
			// 			uni.showLoading();
			// 		this.requestData().then(() => {
			// 			uni.hideLoading();
			// 		})
			// 	}
			// },
			requestData() {
				this.goods.loading = true;
				return new Promise((resolve) => {
					let param = {
						publisher_id: this.options.id,
						// last_time: this.tab.current == 1 ? this.goods.last_time : ''
					};
					app._get('publisher/getPublisherDetail', param, (res) => {
							if (1 == res.code) {
								this.info=res.data
								this.goods.list=res.data.series
								this.info.detail=this.escape2Html(this.info.detail)
								
								// let {
								// 	pack_list,
								// 	last_time
								// } = res.data;

								// // 第一页数据置空
								// if (!this.goods.last_time) {
								// 	this.goods.list.length = 0
								// }

								// this.goods.list = [...this.goods.list, ...pack_list];
								// this.goods.hasMore = pack_list.length > 0;
								// this.goods.last_time = last_time;
							}
						},
						null,
						() => {
							resolve();
							this.goods.loading = false;
						}
					);
				});


			},
			/**
			 * 加载页面数据
			 */
			// getPageData: function(callback) {
			// 	Promise.all([this.requestData()]).then(() => {
			// 		uni.stopPullDownRefresh();
			// 		this.setData({
			// 			loading: false
			// 		});
			// 	});
			// },

			/**
			 * 设置顶部导航栏
			 */
			// setPageBar: function(page) {
			// 	// 设置页面标题
			// 	uni.setNavigationBarTitle({
			// 		title: page.params.title
			// 	}); // 设置navbar标题、颜色

			// 	uni.setNavigationBarColor({
			// 		frontColor: page.style.titleTextColor === 'white' ? '#ffffff' : '#000000',
			// 		backgroundColor: page.style.titleBackgroundColor
			// 	});
			// },

			// 倒计时结束
			// countdownFinished: function() {
			// 	this.requestData();
			// },

			// requestWePageData: function() {
			// 	return new Promise((resolve, reject) => {
			// 		app._get(
			// 			'page/index', null,
			// 			(result) => {
			// 				this.setData(result.data);
			// 			},
			// 			null,
			// 			() => {
			// 				resolve();
			// 			}
			// 		);
			// 	});
			// },
			

		}
	};
</script>
<style lang="scss">
	page,
	body {
		background: $uni-bg-color!important;
	}
</style>
<style lang="scss" scoped>
	.index{
		overflow: hidden;
	}
	.container {
		padding: 0 40rpx 40rpx;
	}

	.diy-component {
		display: block;
		background: $uni-bg-color;
		padding-top: 40rpx;
	}
	.bsn{
		display: flex;
		justify-content: center;
		margin-top: 20rpx;
	}
	.bsn image{
		width: 200rpx;
	}
	.assets-list {
	    overflow: hidden;
	}
	.assets {
	    // width: -webkit-calc((100% - 20rpx) * 0.5);
	    // width: calc((100% - 20rpx) * 0.5);
		width: 100%;
		margin-bottom: 20rpx;
	    border-radius: 20rpx;
		overflow: hidden;
	    // float: left;
	    box-sizing: border-box;
		position: relative;
		border: 1rpx solid #fff;
		box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(255,255,255,0.4);
	}
	
	// .assets:nth-child(even) {
	//     margin-left: 20rpx;
	// }
	
	// .assets:nth-child(n+3) {
	//     margin-top: 20rpx;
	// }
	
	.assets .assets__img-wrapper {
	    // padding-bottom: 100%;
		height: 300rpx;
	    position: relative;
	    // border-radius: 10rpx 10rpx 0 0;
	}
	
	.assets .assets__img {
	    width: 100%;
		height: 100%;
	    position: absolute;
	    left: 0;
	    top: 0;
	}
	.assets .assets-info {
		width: 100%;
		// height: 200rpx;
		padding: 20rpx 10rpx 10rpx;
	    // border-radius: 0 0 10rpx 10rpx;
		box-sizing: border-box;
		position: absolute;
		bottom: 0;
		color: #fff;
		background: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
	}
	
	.assets .assets__no-title {
	    background: $uni-bg-color;
	    padding: 0 10rpx;
	    line-height: 40rpx;
	}
	
	// .assets .assets__no-wrapper {
	//     background: rgba(0, 0, 0, 0.2);
	//     padding: 0 10rpx;
	//     line-height: 40rpx;
	// }
	
	// .assets .assets__price {
	//     color: #000;
	//     font-weight: bold;
	//     font-size: 32rpx;
	// }
	// .assets .icon-qianjin {
	//     color: #000;
	//     font-size: 36rpx;
	// }
</style>
